import { Swiper } from "antd-mobile";
import "./index.css";

function HomeSwiper() {
  const colors = ["#ace0ff", "#bcffbd", "#e4fabd", "#ffcfac"];
  const items = colors.map((color, index) => (
    <Swiper.Item key={index}>
      <div className="content" style={{ background: color }}>
        {index + 1}
      </div>
    </Swiper.Item>
  ));
  return (
    <Swiper
      loop
      onIndexChange={(i) => {
        console.log(i, "onIndexChange1");
      }}
      style={{ position: "absolute", left: 0, right: 0 }}
    >
      {items}
    </Swiper>
  );
}

export default HomeSwiper;
